<template>
	<view>
		<view class="cell-group">
			<u-cell-group :border="false">
				<u-cell title="头像">
					<template v-slot:right-icon>
						<u-avatar :src="userInfo.img_url"></u-avatar>
					</template>
				</u-cell>
				<u-cell title="姓名" :value="userInfo.worker_name"></u-cell>
				<u-cell title="部门" :value="userInfo.new_depart_name"></u-cell>
				<u-cell title="岗位" :value="userInfo.pos_name"></u-cell>
				<u-cell title="手机号码" :value="hidePhone(userInfo.phone)"></u-cell>
				<u-cell title="生日" :value="userInfo.birth_date"></u-cell>
			</u-cell-group>
		</view>

	</view>
</template>

<script>
	import tabbar from '@/components/home-tabbar/index.vue'
	import { useUserStore } from "@/pinia-store/user.js"
	import { useLoginStore } from "@/pinia-store/user.js"
	import { mapStores } from 'pinia'
	
	export default {
		components: {
			tabbar
		},
		data() {
			return {
				modalShow: false,
				userInfo: {}
			}
		},
		onLoad(option) {
			if(option.flag){//说明修改密码回来的
				this.loginOut();
			}
			this.userInfo = this.userStore.user;
		},
		computed: {
		  ...mapStores(useUserStore, useLoginStore)
		},
		methods: {
			hidePhone(phone) {
				return phone.substring(0, 3) + '****' + phone.substring(7);
			}
		}
	}
</script>

<style lang="scss">
	page {
		box-sizing: border-box;
		background-color: #F3F4F5;
		padding: 0 32rpx;
	}
	.cell-group {
		margin-top: 30rpx;
		background-color: #fff;
		border-radius: 10rpx;
	}
</style>